<template>
	<div>
		<div class="fd-nav">
			<div class="fd-nav-left">
				<div class="fd-nav-title" v-if="workFlowDef">{{title}}</div>

			</div>
			<div class="fd-nav-right">
        <vxe-button size="mini" @click="setNote=true" content="流程标题设置"></vxe-button>
				<button type="button" class="ant-btn button-preview" @click="saveSet"><span>保 存</span></button>
				<button type="button" class="ant-btn button-publish" @click="publish"><span>发 布</span></button>
			</div>
		</div>
		<div class="fd-nav-content">
			<section class="dingflow-design">
				<div class="zoom">
					<div :class="'zoom-out'+ (nowVal===50?' disabled':'')" @click="zoomSize(1)"></div>
					<span>{{nowVal}}%</span>
					<div :class="'zoom-in'+ (nowVal===300?' disabled':'')" @click="zoomSize(2)"></div>
				</div>
				<div class="box-scale" id="box-scale" :style="'transform: scale('+nowVal/100+'); transform-origin: 50% 0px 0px;'">
					<nodeWrap v-model:nodeConfig="nodeConfig" v-model:flowPermission="flowPermission"	:isTried="isTried" :tableId="tableId"></nodeWrap>
					<div class="end-node">
						<div class="end-node-circle"></div>
						<div class="end-node-text">流程结束</div>
					</div>
				</div>
			</section>
		</div>
		<errorDialog 
			v-model:visible.sync="tipVisible"
			:list="tipList"	
		/>n
		<promoterDrawer />
		<approverDrawer :directorMaxLevel="directorMaxLevel" :tabDatasxm="tabDatasxm"/>
		<copyerDrawer  :tabDatasxm="tabDatasxm"/>
		<conditionDrawer :tableData="data" />
	</div>
  <el-drawer v-model="setNote" :direction="'rtl'" title="流程标题设置">
    <template #default>
      <el-input
          v-model="tasknote"
          :rows="3"
          type="textarea"
          placeholder="Please input"
      />
      <div v-for="tb in tabDatasxm">
        <div v-if="tb.tableType===0">
          <el-button size="small" v-for="f in tb.Fields" @click="tasknote=tasknote+`{`+f.fieldName+`}`">{{f.fieldDispName}}</el-button>
        </div>
      </div>
    </template>
    <template #footer>
      <div style="flex: auto">
        <el-button @click="setNote=false">关闭</el-button>
      </div>
    </template>
  </el-drawer>
</template>
<script>
import errorDialog from './components/dialog/errorDialog.vue'
import promoterDrawer from './components/drawer/promoterDrawer.vue'
import approverDrawer from './components/drawer/approverDrawer.vue'
import copyerDrawer from './components/drawer/copyerDrawer.vue'
import conditionDrawer from './components/drawer/conditionDrawer.vue'
import {useStore} from '/@/store/index';
import {onBeforeMount, ref, watch} from 'vue-demi'
import {flowPublish} from "/@/api/linkoo/workflow";
import {ElMessage} from "element-plus";

export default {
	components:{errorDialog,promoterDrawer,approverDrawer,copyerDrawer,conditionDrawer},
	props:["title",'process','tabDatasxm','tableData','load','templateID'],
	emits:['flowsave'],
	setup(props,ctx) {
        const isTried = ref(false)
        const tipList = ref([])
        const tipVisible = ref(false)
        const setNote = ref(false)
        let load = ref(false)
        const nowVal = ref(100)
        const processConfig = ref({})
        const nodeConfig = ref({})
        const workFlowDef = ref({})
        const flowPermission = ref([])
        const directorMaxLevel = ref(0)
        const tableId = ref('')
        const tasknote = ref('')
		let data = ref([])
        onBeforeMount(()=>{
			// nodeConfig.value = list.nodeConfig;
			// flowPermission.value = list.flowPermission;
			// directorMaxLevel.value = list.directorMaxLevel;
			// tableId.value = list.tableId
        })
		watch(props,()=>{
		if(props.tabDatasxm){
				data.value=props.tabDatasxm
			}
		//	console.log(props.title,"onBeforeMount");
      if (load&&props.process!==undefined){
        workFlowDef.value= props.process.workFlowDef
		//console.log(workFlowDef.value);
        let list;
        if(!props.process.nodeConfig){
          list = {
            "directorMaxLevel": 0,
            "flowPermission": [],
            "nodeConfig": {
              "ccSelfSelectFlag": "",
              "conditionList": [],
              "conditionNodes": [],
              "childNode": null,
              "directorLevel": "",
              "examineEndDirectorLevel": "",
              "examineMode": "",
              "id": 'fqr',
              "noHanderAction": "",
              "nodeName": "发起人",
              "nodeUserList": [],
              "priorityLevel": "",
              "selectMode": "",
              "selectRange": "",
              "settype": "",
              "type": 0
            },
            "tableId": 1,
            "workFlowDef": {
              "name": props.title
            }
          }
        }else{
          list =props.process
        }
        tasknote.value=list.tasknote===undefined?'':list.tasknote
        processConfig.value = list;
        nodeConfig.value = list.nodeConfig;
        flowPermission.value = list.flowPermission;
        directorMaxLevel.value = list.directorMaxLevel;
        tableId.value = list.tableId
        load=!load
      }
		})
        const reErr=({childNode})=>{
			if (childNode) {
				let {type,error,nodeName,conditionNodes} = childNode
				if (type === 1 || type === 2) {
					if (error) {
						tipList.value.push({ name: nodeName, type: ["","审核人","抄送人"][type] })
					}
					reErr(childNode)
				} else if (type === 3) {
					reErr(childNode)
				} else if (type === 4) {
					reErr(childNode)
					for (var i = 0; i < conditionNodes.length; i++) {
						if (conditionNodes[i].error) {
							tipList.value.push({ name: conditionNodes[i].nodeName, type: "条件" })
						}
						reErr(conditionNodes[i])
					}
				}
			} else {
				childNode = null
			}
		}
     const saveSet=()=> {
			processConfig.value.flowPermission = flowPermission.value
			processConfig.value.tasknote = tasknote
			console.log(processConfig.value,'ddddddddddddddd')
			ctx.emit('flowsave',processConfig.value)
		}
    const publish=()=> {
      flowPublish(props.templateID).then(res=>{
        ElMessage.success("操作成功")
      })
		}
        const zoomSize=(type)=> {
		//	console.log(type);
			if (type === 1) {
				if (nowVal.value === 50) {
					return;
				}
				nowVal.value -= 10;
			} else {
				if (nowVal.value === 300) {
					return;
				}
				nowVal.value += 10;
			}
		}
		return {
			isTried,
			tipList,
			tipVisible,
			nowVal,
      tasknote,
			processConfig,
			nodeConfig,
			workFlowDef,
			flowPermission,
			directorMaxLevel,
			tableId,
			data,setNote,
            reErr,
            zoomSize,
            saveSet,
      publish
		};
	}
};
</script>
<style>
@import "../css/workflow.css";
.error-modal-list {
	width: 455px;
}
</style>